<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // Web存储
        // 1. sessionStorage: 当浏览器关闭时, 数据会被清除
        // 2. localStorage: 当浏览器关闭时, 数据不会被清除, 只有手动清除才会被清除

        // 存储数据
        sessionStorage.setItem('name', '张三');
        localStorage.setItem('age', 18);

        // 获取数据
        console.log(sessionStorage.getItem('name'));
        console.log(localStorage.getItem('age'));

        // 删除数据
        sessionStorage.removeItem('name');
        localStorage.removeItem('age');

        // 存储对象的时候, 需要先转换为字符串
        const obj = {
            name: '张三',
            age: 18,
        };
        const JSONstr = JSON.stringify(obj);
        localStorage.setItem('obj', JSONstr);

        // 获取对象的时候, 需要先转换为对象
        const JSONobj = localStorage.getItem('obj');
        const obj2 = JSON.parse(JSONobj);
        console.log(obj2);

        // 清空所有数据
        sessionStorage.clear();
        localStorage.clear();
    </script>
</body>
</html>